import React, { memo } from "react";

import {
  RecommendRight,
  RecommendLeft,
  RecommendWrapper,
  Content,
} from "./style";

import XJHHotRecommend from "./c-cpns/hot-recommend";
import XJHTopBanner from "./c-cpns/top-banner";
import XJHHotNewAlbum from "./c-cpns/new-album";
import XJHRecommendRanking from "./c-cpns/recommend-ranking";

function XJHRecommend() {
  return (
    <RecommendWrapper>
      <XJHTopBanner />
      <Content className="wrap-v2">
        <RecommendLeft>
          <XJHHotRecommend></XJHHotRecommend>
          <XJHHotNewAlbum></XJHHotNewAlbum>
          <XJHRecommendRanking></XJHRecommendRanking>
        </RecommendLeft>
        <RecommendRight></RecommendRight>
      </Content>
    </RecommendWrapper>
  );
}

export default memo(XJHRecommend);
